<template>
  <div class="home">
    <div @click="changeTestName('哈哈哈哈哈哈')">
      {{testName}}
    </div>
    <HelloWorld :msg="msg" @click="changeRef()"/>
  </div>
</template>

<script lang="ts">
import { defineComponent, ref } from 'vue';
import HelloWorld from '@/components/HelloWorld.vue'; // @ is an alias to /src
import {useTestHooks} from './hooks'

export default defineComponent({
  name: 'Home',
  components: {
    HelloWorld,
  },
  setup(){
    const { testName, changeTestName } = useTestHooks()
    const msg = ref('default')
    const changeRef = ()=>{
      msg.value = 'changed'
    }
    return {
      msg,
      testName,
      changeTestName,
      changeRef
    }
  }
});
</script>
